module.exports = {
  purge: { // 使用手动的方式来启动是否删除任何未使用类
    // https://www.tailwindcss.cn/docs/optimizing-for-production#-2
    enabled: false,
    // enabled: true, // 是否启用清除 (purge) 选项以删除任何未使用类，这样生成的文件尺寸最小
    content: [ // 用于查找那些文件中使用的什么类，那就保留对应的类，进而删除任何未使用类
      // '../**/*.html',
      // 'src/*.html', // 本地测试
      // '../_代码小片段/canvas/*.html' // 其他地方使用的tailwindcss
      './src/**/*.html'
    ],
  },

  // purge: [ // 使用默认的方式，这会根据系统的NODE_ENV=production变量来识别是否删除任何未使用类
  //   'test/*.html', // 本地测试
  // ],
  darkMode: 'media', // or 'media' or 'class'
  theme: {
    extend: {
      width: Object.assign({}, themeSpacing()),
      height: Object.assign({}, themeSpacing())
    },
  },
  variants: {
    extend: {
      height: ['hover', 'focus'],
      width: ['hover', 'focus'],
      borderWidth: ['hover', 'focus'],
      fontWeight: ['hover', 'focus'],
    },
  },
  plugins: [],
}

// 扩展宽度
function themeSpacing() {
  let widthObj = {}
  for (let index = 25; index <= 100; index++) {
    widthObj[index * 4] = index + 'rem';
  }
  return widthObj
}